<template>
	<el-input
		v-model="fieldValue"
		:maxlength="$attrs.type === 'textarea' ? 255 : 100"
		:formatter="(val) => ($attrs.type === 'textarea' ? val : bias ? val.trim() : val.replace(/\//gi, '').trim())"
		clearable
		v-bind="$attrs"
	>
		<template v-for="(slotKey, slotIndex) in Object.keys($slots)" :key="slotIndex" v-slot:[slotKey]>
			<slot :name="slotKey"></slot>
		</template>
	</el-input>
</template>

<script setup name="MyInput">
import { useVModel } from '@vueuse/core';

/***
 * props
 * @property {Array} modelValue v-model绑定的值，
 * @property {Boolean} bias 是否可以输入斜杠，默认不可以
 */
const props = defineProps({
		modelValue: {
			type: String
		},
		bias: {
			type: Boolean,
			default: false
		}
	}),
	emits = defineEmits(['update:modelValue']),
	fieldValue = useVModel(props, 'modelValue', emits);
</script>
